@import "../var";
@import "../mixin";
.small-shop-page {
  .small-shop-hd {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: $clr-white;
    background: url("../../img/smallShop/small-shop-bg.png") no-repeat;
    background-size: 100%;
    height: px(330);
    @include calc(padding,36,20,20);
    .icon-logo {
      position: absolute;
      top: 0;
      left: 10px;
    }
    .small-shop-avatar {
      width: px(88);
      height: px(88);
      border-radius: 50%;
      background: rgba(255,255,255,0.80);
      padding: px(4);
      img {
        width: 100%;
        height: 100%;
        border-radius: 50%;
      }
    }
    .small-shop-tit {
      font-size: px(20);
      margin-top: px(6);
      max-width: 100%;
      @include ellipsis;
    }
    .small-shop-info {
      opacity: .8;
      margin-top: px(4);
      text-align: center;
      @include line-clamp(2);
    }
    .small-shop-contact {
      font-size: px(16);
      margin-top: px(12);
      a {
        position: relative;
        padding: 0 px(30);
        color: $clr-white;
        &:not(:first-child):before {
          content: '';
          position: absolute;
          top: 0;
          bottom: 0;
          left: 0;
          margin: auto;
          height: px(16);
          border-left: 1px solid $clr-ge;
          transform: scaleX(.5);
        }
      }
    }
  }
  //
  .small-shop-swiper {
    border-radius: px(8);
    overflow: hidden;
    margin: px(-82) px(10) px(12);
    img {
      border-radius: px(8);
    }
  }
  //
  .small-shop-nav {
    height: px(50);
    .nav-box {
      position: relative;
      height: px(50);
      overflow: hidden;
      .gzl-navbar {
        height: px(59);
        overflow-y: hidden;
      }
    }
    .fixed {
      position: fixed;
      width: px(375);
      top: 0;
      left: 0;
      right: 0;
      margin: auto;
      z-index: 9;
    }
  }
  //
  .small-shop-type {
    padding: px(10) px(10) px(10);
  }
  .small-shop-list {
    .list-item {
      position: relative;
      width: px(355);
      height: px(236);
      color: $clr-white;
      &:before {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: px(72);
        opacity: 0.4;
        background-image: linear-gradient(-180deg, rgba(0,0,0,0.00) 0%, #000000 99%);
      }
      &:not(:first-child) {
        margin-top: px(10);
      }
      .img-item {
        width: 100%;
        height: 100%;
        border-radius: px(8);
      }
      .info-item {
        position: absolute;
        width: 100%;
        bottom: px(12);
        align-items: center;
        .gzl-flex__item {
          @include calc(padding,0,8,0,16);
        }
        p {
          @include line-clamp(2);
        }
      }
      .price-item {
        height: px(30);
        line-height: px(30);
        @include calc(border-radius,15,0,0,15);
        padding: 0 px(8) 0 px(12);
        background: $clr-warn;
      }
    }
  }
  .gzl-cell__tips {
    color: $clr-g9;
    padding: 0 px(16) px(10);
    a {
      text-decoration: underline;
      padding: 0 px(3);
    }
  }
}
// 返回顶部
.gzl-asidebar {
  right: px(10);
  bottom: px(15);
  .to-top {
    opacity: 0;
    transition: all .3s;
    &.show {
      opacity: 1;
    }
  }
}